<nz-card>
  <nz-descriptions
    nzTitle="基础信息"
    nzBordered
    nzSize="small"
    [nzColumn]="{ xxl: 4, xl: 3, lg: 3, md: 3, sm: 2, xs: 1 }">
    <nz-descriptions-item nzTitle="出库标题">{{ basicInfos?.title || '-' }}</nz-descriptions-item>
    <nz-descriptions-item nzTitle="状态">{{ statusFilter(basicInfos?.state) }}</nz-descriptions-item>
    <nz-descriptions-item nzTitle="新建人员">{{ basicInfos?.founder || '-' }}</nz-descriptions-item>
    <nz-descriptions-item nzTitle="出库单号">
      {{ basicInfos?.deliveryNumber || '-' }}
      <i
        [hidden]="!basicInfos?.deliveryNumber"
        nz-tooltip
        nzTooltipTitle="点击复制"
        nz-icon
        nzType="copy"
        nzTheme="outline"
        (click)="copy(basicInfos?.deliveryNumber)">
      </i>
    </nz-descriptions-item>
    <nz-descriptions-item nzTitle="出库类型">{{ dictFilter(outTypeOptions, basicInfos?.type) }}</nz-descriptions-item>
    <nz-descriptions-item nzTitle="出库数量">{{ basicInfos?.number || '-' }}</nz-descriptions-item>
    <nz-descriptions-item nzTitle="新建时间">{{ basicInfos?.createTime || '-' }}</nz-descriptions-item>
    <nz-descriptions-item nzTitle="关联单号">
      <div *ngIf="[1, 2].includes(basicInfos?.type);else templateOrder">
        <a
          style="color: #409EFF;"
          [routerLink]="basicInfos?.type === 1 ? ['/used-store/usedOrderDetails'] : ['/aisi-recyc/loveOrderDetails']"
          [queryParams]="{ id: basicInfos?.orderId }">
          {{ basicInfos?.orderNum }}
        </a>
      </div>
      <ng-template #templateOrder>-</ng-template>
    </nz-descriptions-item>

    <nz-descriptions-item nzTitle="备注">{{ basicInfos?.remark || '-' }}</nz-descriptions-item>
  </nz-descriptions>
</nz-card>

<nz-card class="m-r-2">
  <p class="form-title">收货人信息</p>
  <div class="form-content">
    <nz-form-item>
      <nz-form-label [nzFlex]="formLabelWidth">合作商</nz-form-label>
      <nz-form-control nzFlex="400px">
        <nz-select
          nzShowSearch
          nzAllowClear
          nzPlaceHolder="请选择合作商"
          [(ngModel)]="subForms.supId">
          <ng-container *ngFor="let option of supplierOptions">
            <nz-option [nzLabel]="option.name" nzValue="{{ option.id }}"></nz-option>
          </ng-container>
        </nz-select>
      </nz-form-control>
    </nz-form-item >

    <nz-form-item>
      <nz-form-label [nzFlex]="formLabelWidth">收货人</nz-form-label>
      <nz-form-control nzFlex="400px">
        <input nz-input maxlength="10" placeholder="请输入收货人" [(ngModel)]="subForms.consignee">
      </nz-form-control>
    </nz-form-item >

    <nz-form-item>
      <nz-form-label [nzFlex]="formLabelWidth">联系方式</nz-form-label>
      <nz-form-control nzFlex="400px">
        <input nz-input maxlength="20" placeholder="请输入联系方式" [(ngModel)]="subForms.tel">
      </nz-form-control>
    </nz-form-item >

    <nz-form-item>
      <nz-form-label [nzFlex]="formLabelWidth">地区</nz-form-label>
      <nz-form-control nzFlex="400px">
        <app-city-select [countyId]="subForms.districtId" (cityChange)="regionChange($event)"></app-city-select>
      </nz-form-control>
    </nz-form-item >

    <nz-form-item>
      <nz-form-label [nzFlex]="formLabelWidth">详细地址</nz-form-label>
      <nz-form-control nzFlex="400px">
        <nz-textarea-count [nzMaxCharacterCount]="100">
          <textarea rows="4" maxlength="100" nz-input placeholder="请输入详细地址" [(ngModel)]="subForms.address"></textarea>
        </nz-textarea-count>
      </nz-form-control>
    </nz-form-item >
  </div>

  <nz-divider></nz-divider>

  <p class="form-title">销售信息</p>
  <div class="form-content">
    <nz-form-item>
      <nz-form-label [nzFlex]="formLabelWidth" nzRequired>销售总价</nz-form-label>
      <nz-form-control nzFlex="400px">
        <nz-input-number
          style="width: 100%;"
          [nzMin]="1"
          [nzStep]="1"
          [nzPrecision]="0"
          nzPlaceHolder="请输入销售总价"
          [(ngModel)]="subForms.sumPrice">
        </nz-input-number>
      </nz-form-control>
    </nz-form-item >
  </div>
</nz-card>

<nz-card class="m-t-2">
  <p class="form-title">出库明细</p>
  <div class="form-content">
    <nz-table
      #basicTable
      nzSize="small"
      nzBordered
      [nzFrontPagination]="false"
      [nzData]="warehouseTable">
      <thead>
        <tr>
          <th nzAlign="center" nzWidth="80px">序号</th>
          <th nzAlign="center" nzWidth="150px">机器编码</th>
          <th nzAlign="center" nzWidth="120px">实际回收价</th>
          <th nzAlign="center" nzWidth="120px">b端成色</th>
          <th nzAlign="center" nzWidth="120px">c端成色</th>
          <th nzAlign="center">机型</th>
          <th nzAlign="center" nzWidth="170px">首次入库时间</th>
          <th nzAlign="center" nzWidth="170px">成交入库时间</th>
          <th nzAlign="center" nzWidth="120px">出库单价</th>
        </tr>
      </thead>
      <tbody>
        <tr *ngFor="let data of basicTable.data; let index = index;">
          <td nzAlign="center">{{ index + 1 }}</td>
          <!-- 机器编码 -->
          <td nzAlign="center">{{ data?.equipmentCode || '-' }}</td>
          <!-- 实际回收价 -->
          <td nzAlign="center">{{ (data?.realValuation || 0) + (data?.aprc || 0) + (data?.cprc || 0) }}</td>
          <!-- b端成色 -->
          <td nzAlign="center">{{ data?.colourNameB || '-' }}</td>
          <!-- c端成色 -->
          <td nzAlign="center">{{ data?.colourName || '-' }}</td>
          <!-- 机型 -->
          <td nzAlign="center" nzBreakWord>{{ data?.modelName || '-' }}</td>
          <!-- 首次入库时间 -->
          <td nzAlign="center">{{ data?.firstTime || '-' }}</td>
          <!-- 成交入库时间 -->
          <td nzAlign="center">{{ data?.clinchTime || '-' }}</td>
          <!-- 出库单价 -->
          <td nzAlign="center">
            <nz-input-number
              style="width: 100%;"
              [nzMin]="0"
              [nzStep]="1"
              [nzPrecision]="0"
              nzPlaceHolder="请输入"
              [(ngModel)]="data.price"
              (nzBlur)="sumTotal('price')"
            ></nz-input-number>
          </td>
        </tr>

        <!-- 合计 -->
        <tr *ngIf="warehouseTable.length" style="color: #303133; font-weight: bold;">
          <td nzAlign="center">合计</td>
          <td nzAlign="center">-</td>
          <td nzAlign="center">{{ sumTotal('realValuation') }}</td>
          <td nzAlign="center" colSpan="5">-</td>
          <td nzAlign="right">{{ sumTotal('price') }}</td>
        </tr>
      </tbody>
    </nz-table>
  </div>
</nz-card>

<nz-card class="m-t-2">
  <div nz-row nzJustify="center">
    <button nz-button nzType="primary" (click)="submitData()">保存</button>
    <button nz-button nzType="default" class="m-l-10" (click)="back()">返回</button>
  </div>
</nz-card>